
.header {
    width: 100%;
    height: 10%;
    background-color: #C0C0C3;
    position: relative;
}

.searchStudent {
    position: absolute;
    margin-left: 40px;
    margin-top: 10px;
    /*background-color: #0DE9F8;*/
}

.main {
    width: 100%;
    height: 90%;
    background-color: #f4f4f4;
    display: flex; /*  父容器 */
}

.studentInfo {
    position: relative;
    flex: 1;
    background-color: #f4f4f4;
}

.studentInfoUl {
    position: absolute;
    margin-top: 7%;
    list-style: none;
    width:42%;
}

.studentInfoUl > li {
    margin-top: 20px;
}

.contentXue {
    height: 20%;
    width: 90%;

    word-break: break-all;
    border: 1px slategray solid;

    /*background-color: burlywood;*/
}

.StudentFailCourse {
    position: relative;
    flex: 1;
    background-color: #f4f4f4;
}

.StudentNotCourse {
    position: relative;
    flex: 1;
    background-color: #f4f4f4;
}

.StudentGraduationCourse {
    position: relative;
    flex: 1;
    background-color: #f4f4f4;

}

.StudentGraduationCourseOL {
    border: 3px #C0C0C3 solid;
    position: absolute;
    margin-top: 24%;
    overflow-x: auto;
    overflow-y: auto;
    height: 75%;
    width: 90%;
}

.lableFour {
    position: absolute;
    margin-top: 7%;
    /*line-height: 45px;*/
    height: 5%;
    width: 90%;
    text-align: center;
    background-color: #C0C0C3;
}

#progress-wrapper > li {
    margin-top: 20px;
}

#progress-wrapper > li > span {
    border-radius: 10px 10px 10px 10px;
    position: absolute;
    width: 100%;
    border: 1px solid black;
}

#progress-wrapper > li > span > span {
    border-radius: 10px 10px 10px 10px;
    background-color: #76b070;
    text-align: center;
    float: left;
    height: 100%;
}
d{
    float: left;
}